<div class="layui-card layadmin-header">
  <div class="layui-breadcrumb" lay-filter="breadcrumb">
    <a><cite>运营工具</cite></a>
    <a><cite>锁单</cite></a>
  </div>
</div>

<div class="layui-fluid">
  <div class="layui-card">
    <div class="layadmin-search">
      <form class="layui-form" method="post" lay-filter="form_resale_product_search">
        <script type="text/html" template lay-done="layui.data.done()">
          <div class="layui-inline">
            <div class="layui-form-label">按产品名称搜索</div>
            <div class="layui-input-inline">
              <input type="text" name="keyword" value="{{decodeURIComponent(layui.router().search.keyword || '')}}"
                     class="layui-input"
                     placeholder="请输入关键字">
            </div>
          </div>

          <div class="layui-inline">
            <div class="layui-form-label">价格区间</div>
            <div class="layui-inline">
              <div class="layui-input-inline">
                <input type="text" name="min_price" autocomplete="off" id="min_price" class="layui-input"
                       style="width: 100px" value="{{layui.router().search.min_price || ''}}" placeholder="最低价格">
              </div>
              <div class="layui-input-inline">~</div>
              <div class="layui-input-inline">
                <input type="text" name="max_price" autocomplete="off" id="max_price" class="layui-input"
                       style="width: 100px" value="{{layui.router().search.max_price || ''}}" placeholder="最高价格">
              </div>
            </div>
          </div>
          <div class="layui-inline">
            <div class="layui-form-label">锁定状态</div>
            <div class="layui-input-inline" style="width: 100px">
              <select name="lock_status">
                <option value="">全部</option>
                <option value="no">未锁定</option>
                <option value="yes">已锁定</option>
              </select>
            </div>
          </div>

          <div class="layui-inline layui-btn-group">
            <button type="submit" lay-submit class="layui-btn" lay-filter="submit_resale_product_search">
              <i class="layui-icon layui-icon-search"></i>查询
            </button>
            <button type="submit" lay-submit class="layui-btn layui-btn-warm"
                    lay-filter="reset_resale_product_search">
              <i class="layui-icon layui-icon-close"></i>重置
            </button>
          </div>

          <button type="submit" lay-submit class="layui-btn layui-btn-danger"
                  lay-filter="btn_lock" id="btn_lock">
            <i class="layui-icon layui-icon-password"></i>一键锁单
          </button>
        </script>
      </form>
    </div>
    <div class="layui-card-body">
      <div id="table_resale_product"></div>
      <script type="text/html" id="tpl_status">
        {{# if (d.status.value === 'init') { }}
        <span class="layui-font-gray">{{d.status.description}}</span>
        {{# } }}
        {{# if (d.status.value === 'on_sale') { }}
        <span class="layui-font-green">{{d.status.description}}</span>
        {{# if (d.left_count <= 0) { }}
        （已锁单）
        {{# } }}
        {{# } }}
        {{# if (d.status.value === 'stop') { }}
        <span class="layui-font-gray">{{d.status.description}}</span>
        {{# } }}
      </script>
      <script type="text/html" id="tpl_resale_user">
        {{d.resale_user.auth ?  d.resale_user.auth.real_name: '未实名'}} ({{d.resale_user.mobile}})
      </script>
      <script type="text/html" id="tpl_tool">
        <a class="layui-table-link" lay-href="product/detail/id={{d.id}}">
          商品详情
        </a>
      </script>
    </div>
  </div>
</div>

<script>
  layui.data.done = function () {

    layui.use(['fox_table'], function () {
      let $ = layui.$
        , fox_table = layui.fox_table
        , form = layui.form
        , admin = layui.admin
        , view = layui.view

      $('select[name="lock_status"]').val(layui.router().search.lock_status)
      form.render()

      let resourceUrl = 'agent-admin/business/resale_products'

      // 列表查询
      fox_table.render({
        id: 'table_resale_product'
        , url: resourceUrl
        , cols: [[
          {title: 'ID', field: 'id', width: 80, align: "center", sort: true}
          , {title: '转售人', templet: '#tpl_resale_user', width: 200}
          , {title: '商品名称', field: 'name', minWidth: 100}
          , {title: '转售价格', field: 'display_price', width: 200, align: "center"}
          , {title: '商品状态', templet: '#tpl_status', width: 150, align: "center"}
          , {title: '转售时间', field: 'created_at', width: 180, align: "center"}
          , {title: '操作', width: 100, align: 'left', fixed: 'right', toolbar: '#tpl_tool'}
        ]]
      });

      //监听操作栏
      fox_table.toolbar(function (obj) {
        let data = obj.data;
      });

      //搜索
      form.on('submit(submit_resale_product_search)', function (d) {
        fox_table.reload(d.field);
        return false;
      });
      //重置
      form.on('submit(reset_resale_product_search)', function (d) {
        $("input[name='keyword']").val('');
        $("input[name='min_price']").val('');
        $("input[name='max_price']").val('');
        fox_table.reload({});
        return false;
      });
      //一键锁单
      form.on('submit(btn_lock)', function (d) {
        showLockForm(d.field);
        return false;
      })

      //显示弹窗
      function showLockForm(data) {
        let minWidth = '600px';
        let minHeight = '450px';
        admin.popup({
          title: '锁单'
          , area: [minWidth, minHeight]
          , id: 'popup_lock'
          , success: function (layero, index) {
            view(this.id).render('business/lock_form', data).done(function () {
              form.on('submit(submit_lock)', function (d) {
                let field = d.field;
                $('#submit_lock').attr('disabled', true).val('请求处理中，请耐心等待');
                admin.post("agent-admin/business/lock_resale_products", field, function (res) {
                  layer.close(index);
                  layer.msg('锁定产品数量' + res.data.lock_count + ',剩余符合条件的商品数量为' + res.data.after_count);
                  fox_table.reload();
                })
              })
            })
          }
        })
      }
    })
  }
</script>

